{% extends "article/base.html" %}
{% load staticfiles %}
{% block title %}articles list{% endblock %}
{% block content %}
<div>
    <table class="table table-hover">
        <tr>
            <td>序号</td>
            <td>标题</td>
            <td>栏目</td>
            <td>操作</td>
        </tr>
        {% for article in articles %}
        <tr id={{ article.id }}>
            <td>{{ forloop.counter }}</td>
            <td><a href="{{ article.get_absolute_url }}">{{ article.title }}</a></td>
            <td>{{ article.column }}</td>
            <td>
                <a name="edit" href="{% url 'article:redit_article' article.id %}"><span class="glyphicon glyphicon-pencil"></span></a>
                <a nane="delete" href="javascript:" onclick="del_article(this, {{ article.id }})"><span class="glyphicon glyphicon-trash" style="margin-left:20px;"></span></a>
            </td>
        </tr>
        {% endfor %}
    </table>
    {% include "paginator.html" %}
</div>

<script type="text/javascript" src='{% static "js/jquery.js" %}'></script>
<script type="text/javascript" src="{% static 'js/layer.js'%}"></script>
<script type="text/javascript">
    function del_article(the, article_id){
        var article_name = $(the).parents("tr").children("td").eq(1).text();
        layer.open({
            type: 1,
            skin: "layui-layer-rim",
            area: ["400px", "200px"],
            title: "删除文章",
            content: '<div class="text-center" style="margin-top:20px"><p>是否确定删除《'+article_name+'》</p> </div>',
            btn:['确定', '取消'], yes: function(){
                $.ajax({
                    url: '{% url "article:del_article" %}',
                    type:"POST",
                    data: {"article_id":article_id},
                    success: function(e){
                        if(e=="1"){
                            parent.location.reload();
                            layer.msg("has been deleted.");
                        }else{
                            layer.msg("删除失败");
                        }
                    },
                })
            },
        });
    }


</script>

{% endblock %}